import type { App } from "vue"

// todo: 还没封装完成

type SlideType = 'left' | 'right' | 'top' | 'bottom' | 'lt' | 'lb' | 'rt' | 'rb'

class SlideAnimate {
  public type
  constructor(type: SlideType) {
    this.type = type || 'left'
  }

  animate(){

  }



}

const DEFALUT_OPTIONS = {
  duration: 300,
}

export function install(app: App) {
  const slide = {
    mounted(el: any, binding: any) {
      const animationOptions = binding.value?.animationOptions || { duration: 300 }
      const animationFrames = binding.value?.animationFrames || [
        { transform: 'translateY(50%)', opacity: 0 },
        { transform: 'translateY(0)', opacity: 1 }
      ]
      const type: SlideType | unknown = binding.value?.slideType
      if (!type) {
        el.animate(animationFrames, animationOptions)

      }
    }
  }
  app.directive('slide', slide)
}
